
<?php
//http://www.smashingmagazine.com/2011/04/05/image-manipulation-with-jquery-and-php-gd/
session_start();
$errors = '';
//if(!isset($_FILES['file'])||empty($_FILES['file']['name'])){
//  $errors = "file can't be blank!";
//}else if(!isset($_POST['file_name'])||empty($_POST['file_name'])){
//  $errors = "file name can't be blank!";
//}else{
//  $allow_types = array('jpg', 'jpeg', 'gif', 'png');
//  preg_match("/\.".implode('|',$allow_types)."$/i",$_FILES['file']['name'],$matchs);
//  $file_ext = substr(strtolower($matchs[0]),1);
//  if(empty($file_ext)||!in_array($file_ext, $allow_types)){
//    $errors = "not allowed file type!";
//  }else{
//    $new_path = "../upload/".$_POST['file_name'].".".$file_ext;
//    if(file_exists($new_path)){
//      $errors = "file name already exist!";
//    }else if(!copy($_FILES['file']['tmp_name'],$new_path)){
//      $errors = "we're sorry ,but some thiing goes wrong!";
//    }else{
//      $_SESSION['img_path'] = $new_path;
//      $_SESSION['file_ext'] = $file_ext;
//    }
//  }
//}
if(!empty($errors)){
  echo $errors;
}else{
  echo "<img id='img' src='".$_SESSION['img_path']."'>";
?>
<style>
  #drag_box { position: absolute; border: solid 1px #333; background: #fff; opacity: 0.5; filter: alpha(opacity=50); z-index: 10; }
</style>
<script src="http://code.jquery.com/jquery-1.4.2.min.js" ></script>
<script>
$(function(){
  drag_process = true;
  $('#img').mousedown(function(e){
    drag_process = true;
    $('#drag_box').remove();
    $("div").css({left:e.clientX,top:e.clientY}).attr("id","drag_box").appendTo("body");
    mousedown_left = e.clientX;
    mousedown_top = e.clientY;
  })

  $(window).mouseup(function(){
    drag_process = false;
  })

  $('#img').mousemove(function(e){
    if (!drag_process) return;
	var newLeft = mousedown_left < e.clientX ? mousedown_left : e.clientX;
	var newWidth = Math.abs(mousedown_left - e.clientX);
	var newTop = mousedown_top < e.clientY ? mousedown_top : e.clientY;
	var newHeight = Math.abs(mousedown_top - e.clientY);
	$('#drag_box').css({left: newLeft, top: newTop, width: newWidth, height: newHeight});
  })
});
</script>
<?php } ?>